<template>
    <rx-dialog @handOk="onOk" @cancel="onCancel">
        <rx-layout>
            <div slot="center">
                <a-collapse v-model="activeKeys" style="margin-top: 5px;">
                    <a-collapse-panel key="1" :header="i18n('list.bpmNode','流程节点')">
                        <a-checkbox-group v-model="checkedKeys" style="width: 100%;">
                            <a-row>
                                <template v-for="node of nodeList">
                                    <a-col :span="6">
                                    <span :title="node.label">
                                        <a-checkbox :value="node.value"  class="rxCheckBox">
                                            {{node.label }}
                                        </a-checkbox>
                                    </span>
                                    </a-col>
                                </template>
                            </a-row>
                        </a-checkbox-group>
                    </a-collapse-panel>
                </a-collapse>
            </div>
        </rx-layout>
    </rx-dialog>
</template>

<script>
import {RxLayout, Util, RxDialog} from '@lowcode/jpaas-common-lib';
import BpmDefNodeApi from '@/api/bpm/core/bpmDefNodeCount'

export default {
    name: "reloadColumnDialog",
    props: {
        nodes: {
            type: Object
        },
        defId:String,
        layerid: String,
        destroy: Function
    },
    components: {
        RxLayout,
        RxDialog,
    },
    computed:{

    },
    data() {
        return {
            nodeList: [],
            checkedKeys: [],
            activeKeys: ['1', '2'],
        }
    },
    created() {
        this.init();
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "listLayoutDialog", key);
        },
        init() {
            var self_=this
            var nodeList = [];

            for (var node in this.nodes) {
                let nodeParam = {value: node, label: this.nodes[node]}
                nodeList.push(nodeParam);
            }
            this.nodeList = nodeList;
            BpmDefNodeApi.getByDefId(this.defId).then(res=>{
                let data=res.data
                if (data){
                    for (var node in data) {
                        //回显已选择的节点
                        self_.checkedKeys.push(data[node].nodeId)
                    }
                }
            });

        },
        onOk(vm) {
            if (this.checkedKeys.length > 0) {
                Util.closeWindow(this, "ok", this.checkedKeys);
            } else {
                this.$message.error(this.i18n("msa.selectOne","至少选择一个流程节点！"));
                vm.loading=false;
            }

        },
        onCancel() {
            Util.closeWindow(this, "cancel");
            this.$layer.close(this.layerid);
        }
    },
    watch: {
        checkedKeys(){
            console.log(this.checkedKeys)

        }
    }
}
</script>

<style scoped>
</style>